﻿@model IEnumerable<Attachment>
@{
    string tenantTypeId = Request.QueryString.Get<string>("tenantTypeId", string.Empty);

    //图片在页面呈现的最大宽度
    int inlinedImageWidth = ViewData.Get<int>("inlinedImageWidth", 0);

    //图片在页面呈现的最大高度
    int inlinedImageHeight = ViewData.Get<int>("inlinedImageHeight", 0);
}
@if (Model != null && Model.Count() > 0)
{
    <div class="tn-text-heading tn-border-bottom tn-border-gray">
        <strong>图片列表</strong>
    </div>
    <div class="tnc-photo-gallery">
        <ul class="tn-photo-list tn-helper-clearfix">
            @foreach (var image in Model)
            {
                int width = Math.Min(image.Width, inlinedImageWidth);
                <li id ="imageId_@(image.AttachmentId)" class="tn-photo-item ">
                    <span class="tn-bg-deep tn-action">
                        @Html.AjaxDeleteButton(new AjaxDeleteButton()
                            .SetConfirm("确定要删除图片？")
                            .SetText("删除")
                            .SetUrl(SiteUrls.Instance()._DeleteAttachment(tenantTypeId, image.AttachmentId))
                            .MergeHtmlAttribute("class", "tn-icon tn-smallicon-cross")
                            .MergeHtmlAttribute("plugin", "tipsy")
                            .MergeHtmlAttribute("title", "删除图片")
                            .MergeHtmlAttribute("name", "operate_" + (image.AttachmentId))
                            .MergeHtmlAttribute("style", "display:none")
                            .SetDeleteTarget("#imageId_" + image.AttachmentId)
                        )
                    </span>
                    <p class="tn-photo-wrap tn-widget-content  tn-border-gray">
                        <a title="点击图片插入编译器" href="javascript:;">
                            <img id="img_@(image.AttachmentId)" name="imageSelect" width="100" height="100" data-width="@(width)" data-biggersize="@SiteUrls.Instance().ImageUrl(image, tenantTypeId, ImageSizeTypeKeys.Instance().Original())"  src="@SiteUrls.Instance().ImageUrl(image, tenantTypeId, ImageSizeTypeKeys.Instance().Small())" />
                            <span></span></a>
                    </p>
                    <p  id="titleImage_@(image.AttachmentId)" class="tn-text-heading"  title="@(image.FriendlyFileName)">
                        @Html.Raw(StringUtility.Trim(image.FriendlyFileName, 8))
                    </p>
                </li>
            }
        </ul>
    </div>
}
<script type="text/javascript">
    $(document).ready(function () {
        $("img[name='imageSelect']").click(function () {
            var titleId = $(this).attr("id").replace(/[^0-9]/ig, "");
            var titleImage = $("#titleImage_" + titleId).attr("title");
            var imageSrc = $(this).attr('src');
            var biggerSize = $(this).data("biggersize");
            var width = $(this).data("width");
            var $tinyMCE = $('#' + tinyMCE.activeEditor.id);
            $tinyMCE.insertContentToEditor('<p><a href="' + biggerSize + '" rel="fancybox"><img alt="' + titleImage + '" width="' + width + '" src="' + biggerSize + '" /></a></p>');
        });

        $("li[id^='imageId_']", $("ul.tn-photo-list")).hover(function () {
            $("a[name='operate_" + $(this).attr("id").replace(/[^0-9]/ig, "") + "']").show();
            $(this).addClass("tn-hover");
            $(this).find("p").first().addClass("tn-border-deep tn-bg-light").removeClass("tn-border-gray");
        }, function () {
            $("a[name='operate_" + $(this).attr("id").replace(/[^0-9]/ig, "") + "']").hide();
            $(this).removeClass("tn-hover");
            $(this).find("p").first().removeClass("tn-border-deep tn-bg-light").addClass("tn-border-gray");
        });

    });
</script>
